<template>
    <div id="loginContent">
        <form>
            <p v-show="seen">登陆界面</p>
            <p v-show="!seen">注册成功！请登陆...</p>
            <i class="el-icon-user-solid" style="color:aqua"></i>
            <input v-model="username" type="text" placeholder="请输入你的账户"><br>
            <i class="el-icon-warning" style="color:aqua"></i>
            <input v-model="password" type="password" placeholder="请输入你的密码"><br>
            <input type="button" @click="loginn" value="登陆"><br>
            <a href="/regist" style="font-size:15px;float:right;color:white;text-decoration:none;margin-top:10px">没有账户，注册一个</a>
        </form>
    </div>
</template>
<script>
// import router from 'vue-router'
export default {
    data(){
        return {
            username:'',
            password:'',
            status:'',
            seen:true
        }
    },
    mounted:function(){
        if(this.$route.query.plan=="1"){
            this.seen=false
        }
        console.log(this.$route.query.plan)
    },
    methods:{
        loginn(){
            this.$axios.get('/api/loginreq',{
            params:{
                username:this.username,
                password:this.password
            },
            // headers:{
            // // token:'110',
            // 'Content-Type':'application/x-www.form-urlencoded'
            // }
            }).then(res=>{
                if(res.data=='1'){
                    this.$router.push({path:"/myBlog/myArtical"})
                    sessionStorage.setItem("sta",res.data)
                    sessionStorage.setItem("username",this.username)
                }
                else if(res.data=='0'){
                    alert("用户名或密码不正确")
                } 

            }).catch(err=>{
                console.log(err)
            })   
        } 
    }
}
</script>
<style scoped>
#loginContent{
        width: 100%;
        height:600px;
        background-color: #353434;;
        background-size: cover;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        font-size: 30px;
        color:white;
}
#loginContent i{
    vertical-align: bottom;
    margin: 0 10px;
}
#loginContent input[type=text]{
    width: 300px;
    height: 50px;
    border:none;
    background-color: transparent;
    border-bottom: 2px solid aqua;
    margin-top:20px;

}
#loginContent input[type=password]{
    width: 300px;
    height: 50px;
    border:none;
    background-color: transparent;
    border-bottom: 2px solid aqua;
    margin-top:20px;

}
#loginContent input[type=button]{
    width: 300px;
    height: 50px;
    border:none;
    background-color: aqua;
    margin-top:50px;
    margin-left:45px;

}
</style>